<style>
</style>
<template>
<div>
    <Card :bordered="false" dis-hover>
        <p slot="title">进项发票录入</p>
        <Row :gutter="20">
			<!-- <Col span="6">
				<Input v-model="search.paramData.orderNo" placeholder="发票号" ></Input>
			</Col> -->
			<Col span="6">
				<Input v-model="search.paramData.orderNo" placeholder="订单号" ></Input>
			</Col>
			<!-- <Col span="10">
				<DatePicker type="datetimerange" format="yyyy-MM-dd"
				placeholder="开票日期" v-model="search.paramData.date"
				@on-change="(r)=>{search.paramData.date=r}" style="width:100%;"></DatePicker>
			</Col> -->
			<Col span="2">
				<Button type="primary" icon="ios-search" @click="getdata('search')">搜索</Button>
			</Col>
		</Row>


		<br/>
	    <div class="ivu-table-wrapper" >
            <div class="ivu-table ivu-table-with-fixed-top ">

                <div class="ivu-table-body" >
                    <table class="table_border _table"  cellspacing="0" cellpadding="0" border="0" style="width: 100%;">

                    	<thead>
		                    <tr>
		                    	<!-- <th class="" style="width:60px;">
			                        	<div class="ivu-table-cell">
			                        		<Checkbox v-model="check" lable="" @on-change="checkchange"></Checkbox>
			                        	</div>
			                        </th> -->
		                        <th class="">
		                            <div class="ivu-table-cell">
		                                <span>订单号</span>
		                            </div>
		                        </th>
		                        <th class="">
		                            <div class="ivu-table-cell">
		                                <span>订单金额&nbsp;(元)</span>
		                            </div>
		                        </th>
		                        <th class="" style="width:180px;">
		                            <div class="ivu-table-cell">
		                                <span>纳税人识别号</span>
		                            </div>
		                        </th>
		                        <th class="">
		                            <div class="ivu-table-cell">
		                                <span>销售方公司名称</span>
		                            </div>
		                        </th>
		                        <!-- <th class="">
		                            <div class="ivu-table-cell">
		                                <span>发票数量</span>
		                            </div>
		                        </th> -->
		                        <th class="" style="width:90px;">
		                            <div class="ivu-table-cell">
		                                <span>发票数量</span>
		                            </div>
		                        </th>
		                        <th class="" style="width:190px;">
		                            <div class="ivu-table-cell">
		                                <span>操作</span>
		                            </div>
		                        </th>
		                    </tr>
	                    </thead>
	                    <tbody class="ivu-table-tbody" v-for="item in data">
		                    <tr class="ivu-table-row">
		                    	<!-- <td class="">
			                            <div class="ivu-table-cell">
			                        		<Checkbox v-model="item.check" lable=""></Checkbox>
			                        	</div>
			                        </td> -->
		                        <td class="">
		                            <div class="ivu-table-cell">
		                                <span>
		                                    {{item.orderNo}}</span>
		                            </div>
		                        </td>
		                        <td class="">
		                            <div class="ivu-table-cell">
		                                <span>{{item.totleAmount}}</span>
		                            </div>
		                        </td>
		                        <td class="">
		                            <div class="ivu-table-cell">
		                                <span>{{item.salesComOrgCode}}</span>
		                            </div>
		                        </td>
		                        <td class="">
		                            <div class="ivu-table-cell">
		                                <span>{{item.salesComName }}</span>
		                            </div>
		                        </td>
		                        <!-- <td class="">
		                            <div class="ivu-table-cell">
		                                <span>{{item.totleAmount}}</span>
		                            </div>
		                        </td> -->
		                        <td class="">
		                            <div class="ivu-table-cell">
		                                <span>{{item.detailCount}}</span>
		                            </div>
		                        </td>
		                        <td class="">
		                            <div class="ivu-table-cell">
		                                <Button @click="show(item)" size="small" >录入发票</Button>
										<Button @click="update(item)" size="small" >修改</Button>
		                                <Button @click="_show(item)" size="small" >
		                                {{item.show?'收起':'详情'}}</Button>


		                            </div>
		                        </td>
		                    </tr>
		                    <tr class="tr_1" v-show="item.show">
		                        <td colspan="6">
		                        	<div style="margin:0px 20px;">
		                        		<table class="table_7b">
		                        			<thead>
		                        				<th>发票号码</th>
		                        				<th>发票编码</th>
		                        				<th>开票日期</th>
		                        				<th>购买方名称</th>
		                        				<th>价税合计&nbsp;(元)</th>
		                        				<th>开票人</th>
		                        			</thead>
			                                <tbody>
			                                    <tr v-for="is in item.list">
			                                        <td>{{is.invoiceNo}}</td>
			                                        <td>{{is.invoiceCode}}</td>
			                                        <td>{{is.invoiceDate | formatDate('yyyy-MM-dd')}}</td>
			                                        <td>{{is.buyerName}}</td>
			                                        <td>{{is.invoiceTotalPriceTax}}</td>
			                                        <td>{{is.drawer}}</td>

			                                    </tr>
			                                </tbody>
		                            	</table>
		                        	</div>

		                        </td>
		                    </tr>
	                    </tbody>
                    </table>
                    <div class="body_empty" v-if="data.length==0 ">
                    	暂无数据
                    </div>
                </div>
            </div>

        </div>
        <p style="margin-top:10px;">
        	<Button type="primary" @click="add">添加进项订单</Button>
	        <Page  show-total :page-size="page.pageSize" :current="search.pageNo"	:total="page.total"
       		show-total @on-change="changePage" style="float:right;"></Page>
        </p>
    </Card>
    <entry-edit @refresh="getdata"></entry-edit>
    <entry-order @refresh="getdata"></entry-order>
</div>
</template>
<script>
import EntryEdit from "../Module/entryedit.vue";
import EntryOrder from "../Module/entryorder.vue";
export default {
  components: { EntryEdit, EntryOrder },
  data() {
    return {
      check: false,
      page: { pageSize: 10, total: 0 },
      search: { pageNo: 1, paramData: { orderNo: null } },
      data: []
    };
  },
  methods: {
    changePage(pageNum) {
      this.search.pageNo = pageNum;
      this.getdata();
    },
    getdata(type) {
      if (type == "search") {
        this.search.pageNo = 1;
      }
      this.axios.post("/incomeinvoice/queryOrder", this.search).then(res => {
        //this.data=res.data.list;
        var d = res.data.list;
        for (var i = 0; i < d.length; i++) {
          d[i].show = false;
          d[i].list = [];
        }
        this.data = d;
        this.page.total = res.data.total;
        this.search.pageNo = res.data.pageNo || 1;
      });
    },
    show(item) {
      this.$bus.emit("bus_entryedit", item.guid);
    },
    checkchange(item) {
      this.data.forEach(function(val) {
        val.check = item;
      });
    },
    add() {
      this.$bus.emit("bus_entryorder");
    },
    update(item) {
      this.$bus.emit("bus_entryorder", JSON.stringify(item));
    },
    _show(item) {
      if (item.show == true) {
        item.show = false;
        return;
      }
      if (item.list.length == 0) {
        this.axios
          .post("/incomeinvoice/list", { guid: item.guid })
          .then(res => {
            item.list = res.data || [];
            item.show = !item.show;
          });
      } else {
        item.show = !item.show;
      }
    }
  },
  mounted() {
    $("._table").resizableColumns({});
  },
  created() {
    this.getdata();
  },
  activated() {
    this.getdata();
  }
};
</script>
